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ABSTRACT . 

Because the complex link and node structure awaiting users 
can lead them into becoming lost in hyperspace and- cause them cognitive 
overload, navigating the hypertext system is often not an easy task, 
especially for novices. They may have difficulty perceiving a structure of an 
entire system, locating specific information, or using a navigational aid. 
This phenomenon can be expected to occur even more in the highly structured 
electronic performance support system (EPSS) . Content providers and designers 
of Web-based integrated EPSS should know how to design interfaces and 
information structures .based on content and purpose. This study analyzed four 
interface design methods (simple selection menu style, menu with global 
navigation, menu with global and local navigation, and pull-down menu) and 
four information structures (linear structure, grid, hierarchy, and network) 
in terms of the complexity, flexibility, navigation, domain knowledge, and 
cognitive load. Based on this analysis, guidelines for building the 
integrated Web-based EPSS effectively are provided. (Contains 28 references.) 
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Abstract 

Because the complex link and node structure awaiting users can lead them into becoming lost in 
hyperspace and cause them cognitive overload, navigating the hypertext system is often not an easy task, 
especially for novices. They have a difficulty perceiving a structure a structure of entire system, locating 
specifying information, using navigational aid. This phenomenon can be more expected in the highly 
structured EPSS. In that point, content providers or designers for web~based integrated EPSS should know 
how to design interface and information structure based on its content and purpose. 

This study analyzed four interface design methods (simple selection menu style, menu with global 
navigation, menu with global and local navigation, and pull-down menu) and four information structures 
(linear structure, grid, hierarchy, and network) in terms of the complexity, flexibility, navigation, domain 
knowledge, and cognitive load. Based on this analysis, guidelines for building the integrated web-based 
EPSS effectively are provided. 



Introduction 



Building an effective EPSS has been a major issue not only in business but also in education and 
government. As more people come to depend on the use of computers and networking to perform their jobs, and as 
hardware and software technologies continue to advance, the potential for EPSS appears tremendous (Collis & 
Verwijs, 1995; Malcolm, 1998; Ockerman et al., 1997). 

Hypertext and hypermedia system enabled designers and programmers to tile all performance support 
system elements together in a way that allowed users to follow their own streams of thought in searching for 
information (Gery, 1991). Hypertext is such a technology that provides a powerful new way of organizing, 
displaying, and accessing information that could affect all forms of systems (Shneiderman and Kearsley 1 989). 
Hypertext consists of the associative links between multiple nodes, which are one or more parts of information, 
forming an interconnected networked (Nelson 1974; Conklin 1987). The linking system in the hypertext system 
allows users to browse through the system utilizing navigational tools (Eklund 1995). However, navigating the 
hypertext system is often not an easy task, especially for novices (King, 1996). The potentially complex link and 
node structure awaiting users can lead them into becoming lost in hyperspace (Nielsen 1990) and cause them 
cognitive overhead (Conklin, 1987). Users have a difficulty perceiving a structure of entire system, locating 
specifying information, using navigational aid. This phenomenon can be more expected in the highly structured 
EPSS. 

Such problems have prompted research on the manner in which users interact with hypertext system. 
Usable design guidelines and principles for navigation can maximize coherence of integrated EPSS and minimize 
users’ cognitive overhead and disorientation. 



Interface design 

When designing an integrated EPSS, two important issues are involved: 1) interface design - how to present 
link system that provide access to the structure, and 2) information structure - how to incorporate the original 
structure of the content into the structure of an EPSS. 

Interface design is basically concerned with the presentation of text, graphics, and linking system on the 
screen. It provides a contextual or structural model for the specification of the logical and functional organization of 
the user interface component, as well as a communication and means between users and system (Laverson, Norman 
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et al. 1987; Norman and Chin 1988; Lai and Waugh 1994; Oliveira, Goncalves et al. 1999). Many researchers has 
been agreed that interface should be designed to provide users efficient and effective organizational model that can 
help users understand the entire system and navigate system to find information without getting lost or cognitive 
overload (Lai and Waugh 1994; Dieberger 1997; Shneiderman 1997; Schenkman and Jonsson 2000). 

Interface on an EPSS provides three major roles for navigation; 1) presenting links, 2) supporting structural 
cues, and 3) providing path mechanism. The interface is the most immediately visible part when a system was user- 
centered (Nielsen 1990). The most fundamental function of interface is to display links one the screen so that a user 
could navigate through a system (Shneiderman 1998). Selecting the links is frequently difficult to navigate in spite 
of the fact that a graphical browser provides the easy to navigation method, "point and click." One factor of 
difficulty in selecting paths for navigation is the presentation of link system. The user navigation performance can 
be influenced by the design and placement of links (Carlson and Kacmar 1999). 

The second role is to support the user perception of structural cues for an effective navigation. If the 
interface does not provide appropriate structural information, users cannot perceive where they are and cannot 
decide where to go. Users also could experience "lost in space" (Dieberger, 1997). 

Information is structured by links and users follow paths developed by designer. As a result, if interface 
design provides the flexible path mechanism that can allow users to jump to the information directly without passing 
pages that are not necessary to get the information, users could find information fast. However, there is some 
possibility to increase user’s cognitive load without providing structural and navigational cues. 

There are four generally used interfaces for navigating the web site: 1) simple selection style, 2) global 
navigation aid, 3) global and local navigation, and 4) pull-down menu styles. 

1) Simple Selection Menu Style 

One type of menu style is simple selection menu style, which is much similar to a table of contents for a 
print book (Chimera and Shneiderman 1994). In this menu style, a user can go to deeper levels of the web site by 
selecting links presented in the current web page. The major drawback of this menu style is that a user has a 
difficulty in perceiving the entire structure of the web site (Chimera, 1994), since when a user moves into lower 
levels, previous menu is replaced with new level. Another drawback of this menu style is that a user is unable to 
traverse to beyond below level because a user has to wait for anew below level select link again before moving 
lower level and select the link below level again. An experienced user is unable to navigate faster than that that of 
novice and this is inefficient and frustrating for experienced users (Laverson, 1987). 

2) Global Navigation Aid Menu Style 

The second menu style is persistent menu that has two split parts. The links on the top level remain in the 
similar area on the left all the time. The content is located in the area on the right and is replaced by its subsequent 
menu when users move other pages. The advantage of this menu style is that a user can go to each page of the top 
level by clicking top level links on the left side from any page in the web sit and that it provides the global structural 
cue to users (Nanard and Nanard 1991). 

3) Global and Local Navigation Menu Style 

The third menu style has two parts of navigation link for global level and local level (Nanard & Nanard, 
1991). The navigation links of top-level pages on the web site usually place on the top of web page and the 
navigation links of current level pages on the web site usually place on left side. The advantage of this menu style is 
to provide not only global structure cue with the top-level navigation links but also local structure cue with current 
level navigation links (Furnas 1997). A user can skip several levels in the web site and it can more efficient than 
other menu design because a "jump -ahead" capability can reduce the time to navigate and find information 
(Laverson, 1987). 

4) Pull-Down Menu Style 

Pull-down menu style appears over objects in the interface instead of in static menu area. Pull-down menu 
allow users with a mouse to access the Web page they want directly. The advantage of the menu style is jump to the 
any page with mouse move and click. However, users can be disoriented or get lost since this menu can't provide 
structural cues. This menu style would be useful for experienced users. 
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Table I. Summary of Menu Style 





Use 


Complexity 


Flexibility 


Access Speed 


Disorientation 


Simple Selection 


Easy 


Low 


Low 


Slow 


Low 


Global Navigation 


Easy 


Middle 


Middle 


Middle 


Middle 


Global & Local Navigation 


Hard 


High 


High 


Fast 


High 


Pull-Down 


Middle 


Very High 


Very High 


Very High 


Very High 



Information Structure 

The structure of a hypertext system can take many different forms. Four basic structures are linear, grid, 
hierarchical, and network structure. However, a web-based integrated EPSS can be designed with more than one 
structure. 



1) Linear Structure 

The simplest way to organize information is in a sequence based on chronological or logical orders. 
Typically it is useful structure to retain the original documentation. Linear structure can be used for guided tour, job 
aids, tutorials, and demonstration of procedure in Web-based EPSS. 




2) Grid 

Grid structure organizes multi-dimensional concepts or categorizations. A serous of procedural manuals 
and list of training courses and materials can be best organized. Grid structure can be organized with one concept or 
categorization in horizontal axis by vertical axis with other concept or categorization. Unfortunately, grid structure 
can be difficult not only to organize but also to understand unless the designer or user recognizes the 
interrelationships between concepts and categorizations of whole information. Therefore, it is best for who already 
have knowledge on topics and its organization (Lynch 1999). 




3) Hierarchy 

A hierarchical structure bas been used widely in the web site (Lynch, 1999), on-line documentation (Gloor 

1997) , information retrieval system (Rosenfeld and Morville 1998), and computer-based instructional programs and 
training (Lai, 1994; Jonassen, 1986). Organization of hierarchical structure starts with general concept or topic into 
specific ones, which are in turn divided into more specific to individual based on precedence and significance 
(Lynch, 1999; Norman, 1988; Sano, 1996). Users can move from general to specific and back to general through the 
linking system presented by menu design. The advantage of hierarchical structure is that familiar to most people 
since it reflects the structure of printed materials (Shneiderman and Kearsley 1989), it is ubiquitous in everyday life 
(Sand 1996), and it is the most natural structures for organizing levels of abstraction (Gloor, 1997). Because of its 
familiarity and pervasiveness, users can easily and quickly understand web sites and hypertext system (Rosenfeld, 

1998) without heavy cognitive overload. In organized hierarchical information structure, the disorientation problem 
can be minimized and users can easily navigate among information nodes by following the linking system (Conklin, 
1987). They are able to develop a mental model of the site's structure and their location within that structure 
(Rosenfeld, 1998). 
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4) Network 

Network structure is composed of associative links that network related concepts and information together. 
While this structure provides relatively effective navigation mechanism, users can easily get lost or disoriented 
because it is so hard for users to understand and predict entire. This structure can apply on small size of Web site for 
high level of training, such as simulation game, strategy training. It would be difficult to manage linking system if 
size is getting bigger (Lynch, 1 999). 




Most complex web sites share aspects of all four types of information structures. Except in sites that 
rigorously enforce a sequence of pages, users are likely to use any web site in a free -form "web- like” manner, just as 
most non-fiction or reference books are used. But the nonlinear usage patterns typical of web surfers do not absolve 
developers of the need to organize their thinking and present it within a clear, consistent structure that comple ments 
design goals for the site. Table 2 shows the characteristics of four basic organization patterns explained above in 
terms of the complexity, flexibility, easy-to-navigation, domain knowledge, and cognitive load. 

Table 2. Summary of Information Structure 





Complexity 


Flexibility 


Navigation 


Domain 

Knowledge 


Cognitive 

Load 


Linear 


Low 


Low 


Very Easy 


Low 


Low 


Grid 


High 


High 


Middle 


High 


High 


Hierarchy 


Middle 


Middle 


Easy 


Middle 


Middle 


Network 


Very High 


Very High 


Haid 


Very High 


Very High 



Depth and Breadth 

The most discussed issues in information structure are branching factors, depth (the number of vertical 
levels or links) and breadth (the number of horizontal documents or links) (Shneiderman 1997). Much has been 
known about tradeoff of "depth and breadth ”, and "complexity and flexibility issues (Larson, 1998; Shneiderman, 
1997). The previous results generally support that deeper hierarchical structure, the less helpful and less favorable 
for navigation. Users have to move through more levels to located information in the deeper structure and should 
need more not only cognitive effort but also physical effort to interact with more displays and links for information 
searching (Shneiderman, 1989). 

Guidelines for building an integrated EPSS 

Design of integrated EPSS can be affected by many factors. These factors include as follows: 

1) Analyzing the nature of information or knowledge 
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In building an effective web-based integrated EPSS, one of the most important things developers have to 
keep in mind is to analyze the nature of information or knowledge to be supported by the site as exactly as possible. 
Depending on the professional medical knowledge with a complex information structure or the general knowledge 
with a simple information structure for its delivery, it might be totally different in terms of the interface design, 
information structure, and the depth and breadth of the information. 

2) Analyzing user characteristics 

In order to build an effective web-based integrated EPSS, developers should clearly analyze the 
characteristics of the target users of the site. That is, the developers need to make a more detailed analysis of the 
target audiences, such as teenagers, professionals of some fields, and so forth. Based on that analysis, the developers 
can grasp the major concerns of the audiences and predict their preferences. This will lead to providing appropriate 
functions just in time when such needs arise. If the EPSS is developed without considering the users' characteristics 
including their preferences, the site, no matter how well organized or useful, will not appeal to the some portion of 
the users any more. 

3) Localizing contents and categories 

Due to the rapid development and spread of communication technology, traditional borders disappeared in 
the terms of information sharing. In other words, we can share any content as soon as it is developed. Considering 
the importance of sharing information, this is very desirable. The problem arises for the fact that every country has 
unique cultural and social context as well as different language. Even in the same country, there can be various 
cultural groups. Certain problems are expected in the use of certain contents in different countries or cultural groups. 
For example, item T, which is categorized as 'A' in one country, can be categorized as 'B' in another country. There 
is a need to readjust contents or categories in terms of cultural and social contexts. The easiest solution is to prepare 
different versions for different groups. Here, the developers may most likely face the effect of tradeoff due to 
additional cost. 

4) Analyzing client system capability 

The developers need to be cognizant of the system environment under which the users are learning. This is 
closely associated with analyzing users characteristics. While the latter is more concerned with physical and 
affective characteristics of the users, the former is more focused on their learning milieu. With the rapid 
development of technologies, we have recently seen many products with newly -added features. Even the products 
marketed in the same year maybe different from one another in terms of system capability. In this vein, the 
developers need to continue their analysis on the learning environment of the users. 

5) Analyzing information accessibility 

We cannot overemphasize the importance of information accessibility for building an effective web-based 
integrated EPSS because the EPSS is delivered via electronic telecommunication technology like Internet. While 
most users with intent to access to Internet use LAN in their office, they rely on modem at home. So, their major 
concern is how expeditiously and conveniently they can access the needed information. When they cannot obtain the 
information they need at their convenience, they will experience inconveniences arising from the use of the site. 

This will eventually turn the users away from the site. Therefore, high level of information accessibility is very 
important factor of a successful EPSS. 

6) Planning information updatability 

Information updatability is another critical issue. In EPSS, this factor is more important than any other 
fields, because the users want information, which is most recently updated at their convenience. In this regard, two 
most important issues arise as to how promptly the information can be updated and who will assume the role of 
updating the information. 

7) Harmonizing internal relationships between other information sources 

Information in EPSS is sophisticated rather than fragmentary. As seen in Figure 1, even the same types of 
information can be restored and delivered in various ways. Some information can be delivered by visual formats 
such as text or graphics or by audible formats such as audio. In this sense, harmonizing internal relationship between 
other information sources is very important. If the internal relationship is not well organized, the EPSS is just an 
archive of unrelated, individual information. 
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Figure 1. Overall Structure of Web-based Integrated EPSS 

8) Integrating external relationships between other EPSS 

Finally, integrating external relationships between other EPSS is another important issue. The developers 
should consider that the EPSS has to be related to external sources at some degree in order to maximize its 
effectiveness. Just as harmonizing internal relationship between other information sources was important, 
integrating external relationship between other EPSS in a harmonious way is a very important factor of successful 
EPSS. 

All of these factors impact the way to present and structure the web-based integrated EPSS. In order to 
maximize the usability of web-based integrated EPSS, therefore, we need to identify and select appropriate menu 
systems and information structures. 



References 

Carlson, J. R. andC. J. Kacmar (1999). Increasing link marker effectiveness for WWW and other 
hypermedia interface: An examination of end-user preferences. Journal of the American Society for Information 
Science 50(5): 386-398. 

Chimera, R. and B. Shneiderman (1994). An expbratory evaluation of three interfaces for browsing large 
hierarchical tables of contents. ACM Transactions on Information Systems 12(A): 383-406. 

Collis, B. A., & Verwijs, C. (1995). A human approach to electronic performance and learning support 
systems: Hybrid EPSSs. Educational Technology, 35(1), 5-21. 

Conklin, J. (1987). Hypertext an introduction and survey. IEEE Compute, 20(9): 17-41. 

Dieberger, A. (1997). Supporting Social Navigation on the World Wide Web. InternationalJournal of 
Human Computer Studies. Special Issue on innovative applications of the WWW. 

Ekiund, J. (1995). Cognitive models for structuring hypermedia and implications for leaning from the 
Worldwide Web. 

Furnas, G. W. (1997). Effective view navigation. Human Factors in Computing Systems CHI 97 
Conference Proceedings^ ACM Press. 

Gery, G. (1991). Electronic performance support systems: How and why to remake the workplace through 
the strategic application of technology. Boston: Weingarten Publications. 

Gloor, P. A. (1997). Elements of hypermedia design: techniques for navigation & visualization in 
cyberspace. Boston, Birkhauser. 

Jonassen, D. H. (1986). Hypertext Principles for Text and Courseware Design. Educational Psychologist, 

2 1 (A), 269-292. 




548 



7 



King, K., L. (1996). Usability of Hypertext: Factors Affecting the Construction of Meaning. Dissertation 
Abstracts International, AAC 1380388. 

Lai, Y. R. and M. L. Waugh (1994). From information searching to learning: A comparison of contrasting 
hyper textual menu designs for computer-based instructional documents. The American Educational Research 
Association, New Orleans, LA. 

Laverson, A., K. Norman, et al. (1987). An evaluation of jump -ahead techniques in menu selection. 
Behaviour and information technology, 6(2): 97-108. 

Lynch, P. J. (1 999). Web style guide: basic design principles for creating web sites. New Haven, New 

Haven. 

Malcolm, S. E. (1992). Reengineering corporate training. Training, 2P(8), 57-61. 

Nanard, J. and M. Nanard (1991). Using structured types to incorporate knowledge in hypertext. The third 
annual ACM conference on Hypertext, San Antonio, TX USA. 

Nelson, T. H. (1974). Dream Machines: new freedoms through computer screens - A minority Report. 
Computer Lib: You can and must understand computers now. Chicago II: Hugo's Book Service 1 974 (Nachdruck 
Microsoft Press 1 988) 

Nielsen, J. (1990). The art of navigating through hypertext. Communications of the ACM, 25(3): 298-. 
Nielsen, J. (1990). Hypertext and Hypermedia. San Diego, Academic Press. 

Norman, K., L. and J. Chin, P. (1988). The Effect of tree structure on search in a hierarchical menu 
selection system. Behaviour and Information Technology. 7(l):51-65. 

Ockerman, J. J., Najjar, L. J., & Thompson, J. C. (1997). Evaluation of a wearable computer performance 
support system. In T. Muldner & T.C. Reeves (Eds), Educational Multimedia/Hypermedia and Telecommunications. 
Charlottesville, VA: Assocication for the Advacement of Computing in Education. 

Oliveira, J. L. d., M. A. Goncalves, et al. (1999). A framework for designing and implementing the users 
interface of a geographic digital library. InternationalJournal on Digital Libraries, 2{H3): 190-206.. 

Rosenfeld, L. and P. Morville {\99^). Information architecture for the World Wide Web. Sebastopol, Ca, 

O'Reilly. 

Sand, D. (1996). Designing large-scale web sties. New York, Wiley Computer Publishing. 

Schenkman, B. N. and F. U. Jonsson (2000). Aesthetics and preferences of web pages. Behavior <Sc 
Information Technology, I9{5): 367-377. 

Shneiderman, B., Ed. (1997). Designing information-abundant Web site: issues and recommendations. 

Web usability (special issue). Available: http://ijhcs.open.ac.uk/shneiderman/shneiderman-nf.html 

Shneiderman, B. (1998). Designing the user interface: strategies for effective human-computer interaction. 
Reading, Mass, Addison-Wesley. 

Shneiderman, B. and G. Kearsley (1989). Hypertext hand-on!: An introduction to a new way of organizing 
and accessing information. Reading: MA, Addison-Wesley Publishing Company. 




549 



8 




U.S. Department of Education 

Office of Educational Research and Improvement (OERI) 
National Library of Education (NLE) 
Educational Resources Information Center (ERIC) 




EducolIOQQl ResQDices Inloniiolloo tma 



NOTICE 



Reproduction Basis 



X 



This document is covered by a signed "Reproduction Release (Blanket)" 
form (on file within the ERIC system), encompassing all or classes of 
documents from its source organization and, therefore, does not require a 
"Specific Document" Release form. 



This document is Federally- funded, or carries its own permission to 
reproduce, or is otherwise in the public domain and, therefore, may be 
reproduced by ERIC without a signed Reproduction Release form (either 
"Specific Document" or "Blanket"). 




EFF-089 (1/2003) 



